<template>
	<view class="container">
		<!-- <uni-nav-bar shadow statusBar="true" fixed="true" left-icon="left" @clickLeft="goBack()" leftText="返回" rightText="添加"
			title="客户管理" @clickRight="goAdd()" /> -->
		<view class="example">
			<uni-list :border="true">
				<uni-swipe-action>
					<!-- right-options 右滑出现的内容。left-options：左滑出现的内容 -->
					<uni-swipe-action-item v-for="(item, index) in dataList" :right-options="options"
						@click="swipeClick($event, index, item.userId)">
						<uni-list-chat :avatar-circle="true" :title="item.nickName+'（'+item.userName+')'" link
							:to="`/pagesA/work/companies/proPlan?user=`+decodeURIComponent(JSON.stringify(item))"
							:avatar="item.avatar?'item.avatar':static_url+'profile.jpg'" :note="item.remark"
							:time="item.phonenumber" :badgeText="item.createTime | timeFormat">
						</uni-list-chat>
					</uni-swipe-action-item>
				</uni-swipe-action>
			</uni-list>

			<uni-fab ref="fab" horizontal="right" vertical="bottom" @fabClick="goAdd()" />
			<!-- 			<uni-load-more :status="statusLoadMore" @clickLoadMore="clickLoadMore" /> -->
			<uni-load-more :status="statusLoadMore" />
		</view>
	</view>
</template>

<script>
	import {
		getUserList,
		delUser
	} from '@/api/system/user';
	export default {
		data() {
			return {
				static_url: getApp().globalData.config.appInfo.static_image_url,
				listQuery: {
					userType: '',
					companyId: this.$store.getters.companyId,
					pageNum: 1,
					pageSize: 10,
					orderByColumn: 'createTime',
					isAsc: 'desc',
				},
				dataTotal: 0,
				dataList: [],
				statusLoadMore: "more", //more,loading,nomore
				options: [{
					text: '删除',
					style: {
						backgroundColor: '#dd524d'
					}
				}],
				isOpened: 'none',
			}
		},
		onBackPress() {
			uni.switchTab({
				url: "/pages/work/index"
			})
		},
		onLoad() {
			// this.getDataList()
		},
		onShow() {
			this.dataList = []
			this.listQuery.pageNum = 1
			//调用获取数据方法
			this.getDataList()
		},
		onPullDownRefresh() {
			this.dataList = []
			this.listQuery.pageNum = 1
			//调用获取数据方法
			this.getDataList()
		},
		onReachBottom() {
			let allTotal = this.listQuery.pageNum * this.listQuery.pageSize;
			if (allTotal < this.dataTotal) {
				this.statusLoadMore = 'loading'; //加载中状态
				this.listQuery.pageNum++;
				this.getDataList()
			}
		},
		filters: {
			timeFormat(time) {
				var moment = require('moment');
				return moment(time).format("YYYY-MM-DD")
			},
		},
		methods: {

			clickLoadMore(e) {},
			swipeClick(e, index, userId) {
				let {
					content
				} = e;
				if (content.text === '删除') {
					uni.showModal({
						title: '提示',
						content: '是否删除',
						success: res => {
							if (res.confirm) {
								delUser(userId).then(() => {
									this.dataList.splice(index, 1);
								})
							} else if (res.cancel) {

							}
						}
					});
				}
			},
			getDataList() {
				uni.showLoading()
				this.listQuery.userType = '3'
				getUserList(this.listQuery).then(response => {
					uni.hideLoading()
					uni.stopPullDownRefresh();
					this.dataTotal = response.total
					this.dataList.push(...response.rows)
					if (this.dataList.length == this.dataTotal) {
						this.statusLoadMore = 'noMore';
					}
				})
			},
			goBack() {
				this.$tab.navigateBack()
			},
			goAdd() {
				this.$tab.navigateTo('/pagesA/work/companies/addCompanies')
			}
		}
	}
</script>

<style>
	page {
		background-color: #ffffff;
		height: 101%;
	}
</style>


<style lang="scss" scoped>
	.chat-custom-right {
		flex: 1;
		/* #ifndef APP-NVUE */
		display: flex;
		/* #endif */
		flex-direction: column;
		justify-content: space-between;
		align-items: flex-end;
	}

	.chat-custom-text {
		font-size: 12px;
		color: #999;
	}

	/deep/.uni-list-chat__badge {
		background-color: #808080;
	}

	/deep/.uni-fab__circle {
		width: 40px;
		height: 40px;
	}
</style>
